/**
 * Created by FreezeSoul on 2018/10/25.
 */
define([
    "app/core/base",
    "app/core/util",
    "../../controls/common/commonMeta",
    "jquery",
    "underscore",
    'JSONParse',
    'loglevel',
    'jqueryTmpl',
    'css!app/plugins/project/majorInfo/resources/style.css'
], function (Chart, Util, Meta, $, _, JSON, log) {

    var property = {
        config: "property",
        option: [
            {
                group: '绑定',
                id: 'bingdingData',
                name: '绑定值数据源',
                enable: true,
                type: 'sortBinding',
                dataset: '',
                columns: [],
                tooltip: '顺序按展示要求'
            }
        ].concat($.extend(true, [], Meta.commonProperties)),
        MapOption: function (option) {
            Util.linkOption(this.option, option);
        }
    };

    var chart = Chart.extend({
        constructor: function (layout) {
            this._layout = layout;
            this._container = null;
            this._template = '<div class="major_info_container scroll-style-3"><div class="row1"></div><div class="row2"></div></div>';
            this._templateItemI = '<div class="major_item ${status}">' +
                '<div class="major_item_date">${year}<br/>${month}-${date}</div>' +
                '<div class="major_item_img"><img src="${iconUrl}"/></div>' +
                '<div class="major_item_title">${title}</div>' +
                '</div>';
            this._templateItemII = '<div class="major_item ${status}">' +
                '<div class="major_item_img"><img src="${iconUrl}"/></div>' +
                '<div class="major_item_title">${title}</div>' +
                '<div class="major_item_date">${year}<br/>${month}-${date}</div>' +
                '</div>';
            this._element = null;
            this._option = {
                Series: [],
                Events: [],
                Extend: $.extend(true, {}, property),
                Option: {
                    uuid: '',
                    class: '',
                    display: true,
                    data: [{key: "合同状态", dateStr: "2018-10-10", status: "normal"},
                        {key: "核准批复", dateStr: "2018 10-10", status: "normal"},
                        {key: "征地手续", dateStr: "2018-10-10", status: "warning"},
                        {key: "林地手续", dateStr: "2018-10-10", status: "normal"},
                        {key: "环评手续", dateStr: "2018-10-10", status: "normal"},
                        {key: "电网接入批复", dateStr: "2018-10-10", status: "normal"},
                        {key: "金融机构贷款承诺", dateStr: "2018-10-10", status: "normal"},
                        {key: "道路开工", dateStr: "2018-10-10", status: "normal"},
                        {key: "基础开工", dateStr: "2018-10-10", status: "normal"},
                        {key: "吊装方进场", dateStr: "2018-10-10", status: "normal"},
                        {key: "塔筒生产", dateStr: "2018-10-10", status: "normal"},
                        {key: "塔筒到货", dateStr: "2018-10-10", status: "normal"},
                        {key: "主吊进场", dateStr: "2018-10-10", status: "normal"},
                        {key: "开始吊装", dateStr: "2018-10-10", status: "normal"},
                        {key: "开始动调", dateStr: "2018-10-10", status: "normal"},
                        {key: "升压站倒送电", dateStr: "2018-10-10", status: "normal"},
                        {key: "机组并网", dateStr: "2018-10-10", status: "normal"},
                        {key: "完成试运行", dateStr: "2018-10-10", status: "normal"},
                        {key: "完成预验收", dateStr: "2018-10-10", status: "normal"},
                        {key: "工程转生产", dateStr: "2018-10-10", status: "normal"}]
                }
            };
        },
        init: function (element) {
            try {
                this._container = element;
            } catch (e) {
                log.error(e);
            }
        },
        _readProperty: function () {
            try {
                if (!this._option.Extend) return;
                Util.deepMapOption(property, this._option.Extend, this._option.Option);
            } catch (e) {
                log.error(e);
            }
        },
        _render: function (option) {
            $(this._container).empty();

            var data = $.extend(true, [], option.data);
            _.each(data, function (item) {
                item.title = item.key;
                if (item.dateStr) {
                    item.year = new Date(item.dateStr).getFullYear();
                    item.month = new Date(item.dateStr).getMonth() + 1;
                    item.date = new Date(item.dateStr).getDate();
                }
                item.iconUrl = "app/plugins/project/majorInfo/images/" + item.status + ".png";
            });

            var rowDataI = data.slice(0, 10);
            var rowDataII = data.slice(10, 20);

            var $row1 = $.tmpl(this._templateItemI, rowDataI);
            var $row2 = $.tmpl(this._templateItemII, rowDataII);

            var $container = $(this._template);
            $row1.appendTo($container.find(".row1"));
            $row2.appendTo($container.find(".row2"));
            $container.appendTo(this._container);

            $container.find("img").hover(
                function () {
                    if ($(this).hasClass("animated")) return;
                    $(this).addClass("animated bounceIn")
                        .one('webkitAnimationEnd mozAnimationEnd MSAnimationEnd oanimationend animationend', function () {
                            $(this).removeClass("animated bounceIn")
                        });
                }, function () {
                }
            );

            return $container;
        },
        example: function () {
            try {

                var exampleOption = {
                    uuid: '',
                    class: '',
                    display: true,
                    data: []
                };

                this._element = this._render(exampleOption);
            } catch (e) {
                log.error(e);
            }
        },
        _bindData: function (data) {
            var _this = this;
            var bindProperty = _.findWhere(this._option.Extend.option, {id: 'bingdingData'});
            if (!bindProperty || !bindProperty.enable) return;

            var dataSetCode = bindProperty.dataset;
            var columns = bindProperty.columns;

            var table = data[dataSetCode];

            _.each(this._option.Option.data, function (item) {
                item.status = "warning";
            });

            if (table && table.length === 1 && columns.length >= 20) {
                _.each(columns, function (column, index) {
                    _this._option.Option.data[index].status = table[0][column.ColumnName] == 1 ? "normal" : "warning";
                });
            }
        },
        setData: function (data) {
            try {
                this._readProperty();

                if (data
                    && this._option.Binding
                    && this._option.Binding.length > 0
                    && this._option.Extend
                ) {
                    this._bindData(data);
                }
                this._element = this._render(this._option.Option);
            } catch (e) {
                log.error(e);
            }
        },
        setOption: function (option) {
            try {
                return this._option = $.extend(true, {}, option);
            } catch (e) {
                log.error(e);
            }
        },
        getOption: function () {
            try {
                this._readProperty();
            } catch (e) {
                log.error(e);
            }
            return this._option;
        },
        setTheme: function (theme) {
            try {
            } catch (e) {
                log.error(e);
            }
        },
        resize: function () {
            try {
            } catch (e) {
                log.error(e);
            }
        },
        showLoading: function () {
            try {
                if (this._layout && this._layout.showLoading) {
                    this._layout.showLoading(this);
                }
            } catch (e) {
                log.error(e);
            }
        },
        hideLoading: function () {
            try {
                if (this._layout && this._layout.hideLoading) {
                    this._layout.hideLoading(this);
                }
            } catch (e) {
                log.error(e);
            }
        },
        dispose: function () {
            try {
                $(this._element).off().remove();
            } catch (e) {
                log.error(e);
            }
        },
        getElement: function () {
            return this._element;
        },
        getChart: function () {
            return this._element;
        }
    });

    return {
        Chart: chart,
        Property: property
    };
});